/* eslint-disable no-debugger */
import Blockquote from "@/components/Blockquote";
import { getListByType, updateConfigByType } from "@/services/api/module/system/config";
import {
	PageContainer,
	ProCard,
	ProDescriptions,
	ProForm,
	ProFormSelect,
	ProFormSwitch,
	ProFormText
} from "@ant-design/pro-components";
import { Button, Col, Divider, Flex, Row, Space, message, Typography } from "antd";
import React, { useEffect, useRef, useState } from "react";
import _ from "lodash";
import RcResizeObserver from "rc-resize-observer";
import { dict } from "@/utils/DictionaryCacheManager";
const Setting = () => {
	const actionRef = useRef();
	const [messageApi, contextHolder] = message.useMessage();
	const [errorRuleError, setErrorRuleError] = useState<any>();
	const [captchaType, setCaptchaType] = useState<any>();
	const [responsive, setResponsive] = useState(false);

	useEffect(() => {
		dict.getDict("error_rule_password").then(data => {
			setErrorRuleError(data);
		});
		dict.getDict("sys_captcha_graph_type").then(data => {
			setCaptchaType(data);
		});
	}, []);
	const handleUpdateCaptcha = (key: any, record: any, originRow: any) => {
		const diff = _.pickBy(record, (value: any, key: any) => originRow[key] !== value);
		console.log("两个对象属性值不同的部分：", diff);
		messageApi.open({
			type: "loading",
			content: "正在修改系统配置，请稍等...",
			duration: 0
		});
		if (!_.isEmpty(diff)) {
			// console.log(true);
			const data = {
				configKey: _.keys(diff)[0],
				configValue: _.get(diff, _.keys(diff)[0]).toString()
			};
			updateConfigByType("captcha", [data])
				.then(res => {
					messageApi.destroy();
					message.success(res?.msg);
					return Promise.resolve();
				})
				.catch(() => {
					messageApi.destroy();
					return Promise.reject();
				});
		}
	};
	return (
		<>
			{contextHolder}
			<RcResizeObserver
				key="resize-observer"
				onResize={offset => {
					setResponsive(offset.width < 596);
				}}
			>
				<ProCard
					wrap
					ghost
					gutter={[10, 10]}
					bodyStyle={{
						padding: responsive ? "0" : "0 20%"
					}}
				>
					<ProCard colSpan={24}>
						<ProDescriptions
							column={1}
							actionRef={actionRef}
							title={
								<Blockquote>
									<Typography.Title level={5}>安全配置</Typography.Title>
								</Blockquote>
							}
							labelStyle={{
								textAlign: "left"
							}}
							request={async () => {
								return getListByType("security").then(data => {
									const config = {};
									data.forEach((item: any) => {
										// @ts-ignore
										config[item?.configKey] = item?.configValue;
									});
									return Promise.resolve({
										success: true,
										data: config
									});
								});
							}}
							colon={false}
							editable={{
								onSave: (key, record, originRow) => {
									console.log("KEY", key, "record", record, "originRow", originRow);
									return Promise.resolve();
								}
							}}
						>
							<ProDescriptions.Item
								dataIndex="sys_security_init_password"
								label="系统初始化密码"
								formItemProps={{
									style: {
										width: 300
									}
								}}
								contentStyle={{
									justifyContent: "end"
								}}
								valueType="password"
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_security_error_max_password"
								label="密码最大错误次数"
								valueType="digit"
								fieldProps={{
									style: {
										width: 200
									}
								}}
								contentStyle={{
									justifyContent: "end"
								}}
								formItemProps={{
									style: {
										width: 200
									}
								}}
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_security_error_password_rule"
								label="密码超出错误次数执行策略"
								valueType="select"
								valueEnum={errorRuleError}
								contentStyle={{
									justifyContent: "end"
								}}
								formItemProps={{
									style: {
										width: 300
									}
								}}
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_security_enable_for_password"
								fieldProps={{
									checkedChildren: "是",
									unCheckedChildren: "否"
								}}
								contentStyle={{
									justifyContent: "end"
								}}
								label="是否开启找回密码"
								valueType="switch"
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_security_reset_password_notice"
								tooltip="开启后确保用户绑定手机号或邮箱，否则将无法通知默认为邮箱通知！"
								label="重置密码通知"
								valueType="switch"
								contentStyle={{
									justifyContent: "end"
								}}
								fieldProps={{
									checkedChildren: "是",
									unCheckedChildren: "否"
								}}
							/>
						</ProDescriptions>
					</ProCard>
					<ProCard colSpan={24}>
						<ProDescriptions
							column={1}
							actionRef={actionRef}
							contentStyle={{
								justifyContent: "end"
							}}
							title={
								<Blockquote>
									<Typography.Title level={5}>验证码配置</Typography.Title>
								</Blockquote>
							}
							request={async () => {
								return getListByType("captcha").then(data => {
									const config = {};
									data.forEach((item: any) => {
										const value = item.configValue; // 从 item 中获取属性值
										if (value === "true" || value === "false") {
											// @ts-ignore
											config[item.configKey] = value === "false" ? false : true; // 将字符串转换为布尔值
										} else {
											// @ts-ignore
											config[item.configKey] = value; // 其他情况保持原样
										}
									});
									return Promise.resolve({
										success: true,
										data: config
									});
								});
							}}
							editable={{
								// @ts-ignore
								onSave: (key, record, originRow) => handleUpdateCaptcha(key, record, originRow)
							}}
							colon={false}
						>
							<ProDescriptions.Item
								dataIndex="sys_captcha_enable"
								label="是否开启验证码"
								fieldProps={{
									checkedChildren: "开启",
									unCheckedChildren: "关闭"
								}}
								contentStyle={{
									justifyContent: "end"
								}}
								valueType="switch"
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_captcha_num"
								label="验证码字符数"
								valueType="digit"
								fieldProps={{
									max: 6,
									min: 4,
									style: {
										width: 300
									}
								}}
								contentStyle={{
									justifyContent: "end"
								}}
							/>
							<Divider style={{ margin: "5px 0" }} />
							<ProDescriptions.Item
								dataIndex="sys_captcha_graph_type"
								label="验证码类型"
								valueType="select"
								contentStyle={{
									justifyContent: "end"
								}}
								valueEnum={captchaType}
								formItemProps={{
									style: {
										width: 300
									}
								}}
							/>
						</ProDescriptions>
					</ProCard>
				</ProCard>
			</RcResizeObserver>
		</>
	);
};

export default Setting;
function _isEmpty(diff: any) {
	throw new Error("Function not implemented.");
}
